import React from "react";
import BaseModal from "@biz/BaseModal";
import {LdhButton, LdhMapSelect, LdhUpload, LdhFormItem, Message} from "@biz/Components";
import GUtils from "@/utils";

const prefix = "confirm-withdrawal-modal";
export default class  ConfirmWithdrawalModal extends BaseModal {

    constructor(props) {
        super(props);
        this.visibleStatus = "withdrawal";
        this.title = "修改提现状态";
        this.className = prefix;
        this.width = 700;
        this.noOp= true;

    }

    componentWillReceiveProps(nextProps, nextContext) {
        let {modalStatus, withdrawalData} = nextProps.store;
        let oldModalStatus = this.props.store.modalStatus;

        if(modalStatus && modalStatus!=oldModalStatus){
            let {shopId, shopName, amount, status} = withdrawalData;
            this.title = `修改提现状态 ${shopName} (${amount})`
            setTimeout(()=>{
                this.form().setFieldsValue({shopId, shopName, status:status+""});
            },100)

        }else{
            this.title = `修改提现状态`
        }
    }

    onSubmit(values){
        let {action, store:{withdrawalData}} = this.props;
        let {id, fileId, picUrl, filepath} = withdrawalData;
        let vo = {id,...values, fileId, picUrl, filepath}
        action.confirmWithdrawal(vo, ()=>{
            this.onCancel();
        });

    }
    onCancel(){
        let {action} = this.props;
        action.cancelModal();
    }

    handleUploadChange(v){
        let rsp = v.file.response;
        if(!rsp) return;
        if(rsp.success){
            let {id,url,filepath} = rsp.vo;
            let {store, action} = this.props;
            let {withdrawalData} = store;

            withdrawalData.fileId= id;
            withdrawalData.picUrl = url;
            withdrawalData.filepath = filepath;
            action.setNewState({withdrawalData})
        }else{
            Message.warning(rsp.errMsg);
        }
    }

    renderDetail() {
        let {withdrawalData={}} = this.props.store;
        return <div>
            <LdhFormItem label="门店名称" name="shopName" required>
                <div>{withdrawalData.shopName}</div>
            </LdhFormItem>
            <LdhFormItem label="提现状态" name="status" required>
                <LdhMapSelect type="ShopWithdrawalStatus" disabled={2==withdrawalData.status} className="w-200"/>
            </LdhFormItem>

            <LdhFormItem label="图片" name="pic" required>

                <LdhUpload action={GUtils.uploadShopWithdrawalUrl} maxCount={1} onChange={this.handleUploadChange.bind(this)}>
                    <LdhButton type="primary" className="upload-btn">点击上传 </LdhButton>
                    <span className="tip">只能上传 jpg/png/gif 文件，且不超过 5MB</span>
                </LdhUpload>

            </LdhFormItem>
            { withdrawalData.picUrl && <img src={withdrawalData.picUrl}/>}
        </div>
    }

}